<template>
    <div>
        <input type="text" placeholder="请输入商品名称">
        <span @click="$router.back(-1)">取消</span>
        <div id="remen">
            <span>热门搜索</span>
        </div>
            <ul>
                <li>
                    <a class="item" href="">降温必备</a>
                </li>
                <li>
                    <a class="items" href="">鞋</a>
                </li>
                <li>
                    <a class="items" href="">蓝牙耳机</a>
                </li>
                <li>
                    <a class="items" href="">牙膏</a>
                </li>
                <li>
                    <a class="items" href="">茶</a>
                </li>
                <li>
                    <a class="items" href="">收纳</a>
                </li>
                <li>
                    <a class="items" href="">拖把</a>
                </li>
                <li>
                    <a class="items" href="">咖啡</a>
                </li>
                <li>
                    <a class="items" href="">湿巾</a>
                </li>
                <li>
                    <a class="items" href="">水杯</a>
                </li>
                <li>
                    <a class="items" href="">女鞋</a>
                </li>

            </ul>
    </div>

</template>

<script>
 // import SearchNavComljj from "../components/nav/SearchNavComljj.vue";
    export default {
        name: "SearchView",
        components:[

        ]
    }
</script>

<style scoped>
    div {
        width: 100%;
        height: 170px;
        background: #eeeeee;
        text-align: center;
        padding-top: 10px;
    }

    input {
        width: 76%;
        height: 1.8rem;
        border-radius: 0.2rem;
        border: 0;
        background-image: url(https://yanxuan.nosdn.127.net/15954074352382011.png);
        background-repeat: no-repeat;
        background-size: 1.4rem;
        background-position: 8px;
        text-align: center;
    }

    span {
        padding-left: 18px;
    }

    #remen {
        width: 100%;
        height: 100px;
        margin-top: 5px;
        text-align: left;
        font-size: 12px;
    }
ul{
    width: 100%;
    height: 100px;
    margin-top: -70px;
}
    ul>li{
        float: left;
        padding-left: 15px;
        justify-content: space-around;

    }
    .item{
        border: 1px solid #dd1a21;
        color: #dd1a21;
        padding: .3rem;
        margin-right: .4rem;
        margin-bottom: .5rem;
        line-height: .2rem;
        border-radius: 4px;
        font-size: 14px;
    }
    .items{
        float: left;
        padding: .3rem;
        margin-right: .4rem;
        margin-bottom: .8rem;
        line-height: .6rem;
        border: 1px solid #999;
        border-radius: 4px;
        color: #333;
        font-size: 14px;
    }
</style>